import { createSlice, PayloadAction } from '@reduxjs/toolkit'
import { SongType } from '@/untils/musicType'
interface StateType {
  selectedKey: string
  musicGroup: {
    id: ''
    name: ''
    image: ''
    time: ''
  }
  songId: string
  play: boolean
  musicList: SongType[] | []
}
const musicSlice = createSlice({
  name: 'music',
  initialState: <StateType>{
    selectedKey: '',
    musicGroup: {},
    songId: '',
    play: false,
    musicList: []
  },
  reducers: {
    setMusicGroup(state, { payload }) {
      state.musicGroup = payload
    },
    changeSelectedKey(state, { payload }: PayloadAction<string>) {
      state.selectedKey = payload
    },
    changeSon(state, { payload }: PayloadAction<string>) {
      state.songId = payload
    },
    changeSonOrPlay(state, { payload }: PayloadAction<string>) {
      if (payload === state.songId) {
        state.play = !state.play
      } else {
        state.songId = payload
        state.play = true
      }
    },
    setMusicList(state, { payload }: PayloadAction<SongType[] | []>) {
      state.musicList = payload
    },
    changePlay(state, { payload }: PayloadAction<boolean>) {
      if (state.songId) {
        state.play = payload
      } else {
        state.play = false
      }
    }
  }
})
export const { changeSelectedKey, setMusicGroup, changeSonOrPlay, setMusicList, changeSon, changePlay } =
  musicSlice.actions
export default musicSlice.reducer
